//在线澄清
<template>
  <div class="cell-btn xh-list">
     <div class="div-top">
      <group class="group-main">
        <cell>
          <div slot="title"
               class="head">发标主题:{{InviteBidTopic}}</div>
          <div slot="inline-desc"
               class="div-desc">
            <!-- <div>发标日期:&nbsp;{{pageData1.EmitBidTime}}</div> -->
          </div>
        </cell>
      </group>
    </div>
    <!-- <search :auto-fixed="false"
            v-model="searchText"
            @on-submit="getResult" placeholder=""></search> -->
    <group v-for="(item,index) in getResult"
           :key="index"
           class="group-main">
      <cell :link="{path:'/demos/invite-bid-ask-detail',query:{inviteBidGUID:item.InviteBidGUID,inquiryGUID:item.Oid,replyState:item.Status}}">
        <div slot="title"
             class="head">{{item.QuestionTitle}}</div>
        <div slot="inline-desc" 
             class="div-desc">
          <span class="cell-desc">{{item.QuestionContent}}</span>
          <div class="div-date">
            <div class="div-left">质询日期:&nbsp;{{formatDate(item.QuestionTime)}}</div>
            <div class="div-right">
              <a :class="item.StateClass">{{item.Status}}</a>
            </div> 
          </div>
        </div>
      </cell>
    </group>
  </div>
</template>

<script>
import { Search, Group, Cell, dateFormat } from 'vux'
import { InviteBidAskService } from '../../service/Services.js'
import _ from 'lodash'

export default {
  name: 'CellBtn',
  components: {
    Search,
    Group,
    Cell
  },
  data () {
    return {
      providerGUID: '',
      searchText: '',
      pageData: [],
      InviteBidTopic: ''

    }
  },
  methods: {
    loadData () {
      this.$vux.loading.show({
        text: '加载中...'
      })
      this.providerGUID = this.$store.getters.getUserInfo.ProviderGUID
      this.InviteBidTopic = this.$route.query.InviteBidTopic
      let InviteBidGUID = this.$route.query.InviteBidGUID
      InviteBidAskService.getInviteBidAsk(this.providerGUID, InviteBidGUID).then((res) => {
        this.$vux.loading.hide()
        this.pageData = res.Data
        for (var i = 0; i < this.pageData.length; i++) {
          let item = this.pageData[i]
          item.StateClass = 'button-init button-gray'
          if (item.Status === '未回复') {
            item.Status = '回复'
            item.StateClass = 'button-init button-red'
          }
        }
      }).catch((res) => {
        this.$vux.toast.show({
          text: '请求失败,请联系管理员',
          type: 'cancel',
          width: '180px'
        })
      })
    },
    formatDate (myDate) {
      var msec = myDate.match(/\d+[+]\d+/gi)
      return dateFormat(new Date(Number.parseInt(msec)), 'YYYY-MM-DD')
    }
  },
  computed: {
    getResult () {
      return _.filter(this.pageData, item => { return item.QuestionTitle.indexOf(this.searchText) !== -1 })
    }
  },
  created () {
    this.loadData()
  }
}
</script>

<style scoped lang="less">
.cell-main {
  margin-top: 10px;
}

.cell-desc {
  display: block;
  margin: 5px 0px;
  word-wrap:break-word
}

.head {
  font-weight: bold;
  font-size: 19px;
  color: #111111;
  // white-space: nowrap;
  // overflow: hidden;
  // text-overflow: ellipsis;
}

.div-date {
  border-top: 0.5px dashed #E4E4E4;
  margin: 15px 0 0 0;
  padding-top: 10px;
}

.div-left {
  float: left;
}

.div-right {
  float: right;
}

.div-desc {
  color: #7F7F7F;
}

.button-red {
  color: white;
  background: #DC220B;
      padding: 0 18px!important;
}

.button-gray {
  color: white;
  background: #CCCCCC;
}

.button-init {
  font-size: 12px;
  height: 23px;
  line-height: 23px;
  padding: 0 12px;
  border-radius: 20px;
  display: inline-block;
}
</style>
